@extends('layouts.template')

@section('title', '管理后台')

@section('content')

    <script>
        var selectedMenu = 'order/all';
        var selectedTitle = '订单详情';

        $(function(){

            var form = new Vue({
                el:'#contentpanel',
                data:{
                },
                computed:{
                },
                mounted:function(){
                },
                watch: {
                },
                methods:{
                },
                components:{
                }
            });

        });

    </script>

    <div class="contentpanel" id="contentpanel">

        <div class="row">
            <div class="col-md-12">

                @component('order.layouts.showHeader',['option'=>'detail','order'=>$order])
                @endcomponent

                <!-- Tab panes -->
                <div class="tab-content mb30">
                    <div class="tab-pane active">

                        <div class="panel panel-default">
                            <div class="panel-heading">
                                <div class="panel-btns" style="display: none;">
                                    <a href="" class="panel-minimize tooltips" data-toggle="tooltip" title="" data-original-title="Minimize Panel"><i class="fa fa-minus"></i></a>
                                    <a href="" class="panel-close tooltips" data-toggle="tooltip" title="" data-original-title="Close Panel"><i class="fa fa-times"></i></a>
                                </div><!-- panel-btns -->
                                <h5 class="panel-title">下单时间：{{$order->add_time}}&nbsp;&nbsp;&nbsp;&nbsp;订单状态：{{$order->status->merchant_status_text}}</h5>
                                <p>截止报价时间{{$order->offering_endtime}}</p>
                            </div><!-- panel-heading -->
                            <ul class="nav nav-justified nav-wizard nav-disabled-click nav-pills">
                                <li id="status_1" :class="{active:1 <= <?php echo $order->status->merchant_status?>}"><a><span style="font-size: 20px">①</span><strong>发布订单</strong></a></li>
                                <li id="status_2" :class="{active:2 <= <?php echo $order->status->merchant_status?>}"><a><span style="font-size: 20px">②</span><strong>多个师傅报价</strong></a></li>
                                <li id="status_3" :class="{active:3 <= <?php echo $order->status->merchant_status?>}"><a><span style="font-size: 20px">③</span><strong>挑选师傅雇佣</strong></a></li>
                                <li id="status_4" :class="{active:4 <= <?php echo $order->status->merchant_status?>}"><a><span style="font-size: 20px">④</span><strong>托管服务费用</strong></a></li>
                                <li id="status_5" :class="{active:5 <= <?php echo $order->status->merchant_status?>}"><a><span style="font-size: 20px">⑤</span><strong>师傅服务中</strong></a></li>
                                <li id="status_6" :class="{active:6 <= <?php echo $order->status->merchant_status?>}"><a><span style="font-size: 20px">⑥</span><strong>师傅完成服务</strong></a></li>
                                <li id="status_7" :class="{active:7 <= <?php echo $order->status->merchant_status?>}"><a><span style="font-size: 20px">⑦</span><strong>验收交易成功</strong></a></li>
                            </ul>
                        </div>

                        <div class="panel panel-default">
                            <div class="panel-heading">
                                <div class="panel-btns" style="display: none;">
                                    <a href="" class="panel-minimize tooltips" data-toggle="tooltip" title="" data-original-title="Minimize Panel"><i class="fa fa-minus"></i></a>
                                    <a href="" class="panel-close tooltips" data-toggle="tooltip" title="" data-original-title="Close Panel"><i class="fa fa-times"></i></a>
                                </div><!-- panel-btns -->
                                <h5 class="panel-title">订单编号：{{$order->order_number}}&nbsp;&nbsp;&nbsp;&nbsp;订单类型：{{$order->service_type_text}}&nbsp;&nbsp;&nbsp;&nbsp;服务完成确认码：{{$order->confirm_code}}</h5>
                            </div><!-- panel-heading -->
                            <div class="panel-body nopadding">
                                <form class="form-bordered">
                                    <div class="form-group">
                                        <label class="col-sm-4 control-label"><strong><u>客户信息</u></strong></label>
                                        <div class="col-sm-9">
                                            客户姓名：{{$order->detail->customer_name}}
                                        </div>
                                        <div class="col-sm-9">
                                            客户手机：{{$order->detail->customer_phone}}
                                        </div>
                                        <div class="col-sm-9">
                                            客户地址：{{$order->detail->customer_area_text}} {{$order->detail->customer_address}}
                                        </div>
                                        <div class="col-sm-9">
                                            电梯步梯：{{$order->detail->customer_elevator_text}} {{$order->detail->customer_floor}}楼
                                        </div>
                                        <div class="col-sm-9">
                                            是否核销：
                                            @if ($order->detail->customer_tmall_number)
                                                需要天猫喵师傅核销 {{$order->detail->customer_tmall_number}}
                                            @else
                                                不需要
                                            @endif
                                        </div>
                                    </div><!-- form-group -->

                                    <div class="form-group">
                                        <label class="col-sm-4 control-label"><strong><u>物流信息</u></strong></label>
                                        <div class="col-sm-9">
                                            是否到货：{{$order->status->logistics_status_text}}
                                        </div>
                                        <div class="col-sm-9">
                                            物流单号：{{$order->detail->logistics_ticketnumber}}
                                        </div>
                                        <div class="col-sm-9">
                                            包装件数：{{$order->detail->logistics_packages}}件
                                        </div>
                                        <div class="col-sm-9">
                                            物流公司：{{$order->detail->logistics_name}}
                                        </div>
                                        <div class="col-sm-9">
                                            物流电话：{{$order->detail->logistics_phone}}
                                        </div>
                                        <div class="col-sm-9">
                                            提货地址：{{$order->detail->logistics_address}}
                                        </div>
                                        <div class="col-sm-9">
                                            备注说明：{{$order->detail->logistics_mark}}
                                        </div>
                                    </div><!-- form-group -->

                                    <div class="form-group">
                                        <label class="col-sm-4 control-label"><strong><u>下单用户</u></strong></label>
                                        <div class="col-sm-9">
                                            下单联系人：{{$order->detail->merchant_name}}
                                        </div>
                                        <div class="col-sm-9">
                                            手机号码：{{$order->detail->merchant_phone}}
                                        </div>
                                        <div class="col-sm-9">
                                            服务要求：
                                            @if ($order->detail->merchant_finish_time)
                                                希望师傅在{{$order->detail->merchant_finish_time_text}}前完成服务
                                            @endif
                                        </div>
                                    </div><!-- form-group -->

                                    <div class="form-group">
                                        <label class="col-sm-4 control-label"><strong><u>货品信息</u></strong></label>
                                        <div class="table-responsive">
                                            <table class="table table-bordered mb30 table-dark">
                                                <thead>
                                                <tr>
                                                    <th>货品图片</th>
                                                    <th>货品名称</th>
                                                    <th>货品数量</th>
                                                    <th>备注说明</th>
                                                </tr>
                                                </thead>
                                                <tbody>
                                                @foreach ($order->goods as $goods)
                                                    <tr>
                                                        <td><img width="150" src="{{$goods->goods_img_url}}"></td>
                                                        <td>{{$goods->goods_name}}<br/>({{$goods->goods_type_text}})</td>
                                                        <td>{{$goods->goods_num}}</td>
                                                        <td>{{$goods->goods_mark}}</td>
                                                    </tr>
                                                @endforeach
                                                </tbody>
                                            </table>
                                        </div>
                                    </div><!-- form-group -->


                                </form>
                            </div><!-- panel-body -->
                        </div>

                    </div><!-- tab-pane -->
                </div><!-- tab-content -->

            </div><!-- col-md-6 -->
        </div>
    </div><!-- contentpanel -->

@endsection

